import React from 'react'

export default function App() {
  const t1=new Task();
  t1.id=1
  t1.name="学习HTML和CSS"
  t1.done=true

  const t2=new Task();
  t2.id=2
  t2.name="学习javascript和ES6"
  t2.done=true

  const t3=new Task();
  t3.id=3
  t3.name="学习Vue全家桶"
  t3.done=true


  const t4=new Task();
  t4.id=4
  t4.name="学习React全家桶"
  t4.done=false


  const taskList=new Array()
  taskList.push(t1)
  taskList.push(t2)
  taskList.push(t3)
  taskList.push(t4)


  return (
    <div>
        <ul>
            {
                taskList.length>0&&taskList.map(item=><li key={item.id}>
                    {item.show()}
                </li>)
            }
        </ul>
    </div>
  )
}
class Task{
    id;
    name;
    done;
    show(){
        return this.done?<div style={{textDecoration:'line-through',color:'#999'}}>{this.name}</div>:<div>{this.name}</div>
    }
}